@import url('common.less');

.icon{
  .bg-size('detail.png',115px,77px);
  .dib(24,24);
}

body{
  .bg-color(#e5e6e7);
}
.bg-white{
  .bg-color(#fff);
}
.box{
  box-shadow:0 0 3px #d1d1d2;
  .mt10;
  .bdt(#dedede);
  .bg-white;
}
.banner{
  .tc;
  .cw;
  .pr;
  h1{
    .fz(18);
    .lh(30);
    .pt(100);
    .plr(20);
  }
  h4{
    .mt(20);
    .fz(26);
    .h(38px);
    span{
      border-bottom:2px solid #fff;
      .pb(10);
    }
  }
  .foot{
    .mt(40);
    a{
      margin:0 10px;
      .cw;
      display:inline-block;
      .w(40px);
    }
    .icon{

    }
    .on{
      .c(#ebc20d)
    }
  }
}
.like-icon{
  background-position:2px -34px;
}
.had-icon{
  background-position:-26px -34px;
}
.time-icon{
  background-position:-49px -31px;
}
.only-icon{
  background-position:-49px 4px;
}
.on{
  .like-icon{
    background-position:2px 0;
  }
  .had-icon{
    background-position:-26px 0;
  }
}


.banner-cover{
  .pa();
  .wh(100%,100%);
}
.top-info{
  .p10;
}
.info-top{
  .bdb(#e6e6e6);
  .h(30px);
  .lh(25);
  .g9;
  .time{
    .fr;
  }
  .icon{
    .fl;
  }
}
.buy-user-list {
  .pt(20);
  .pb(10);
  .dl(40);
  .cont{
    img{
      .wh(26px,26px);
    }
    .first-user{
      background:url(../../images/hat.png) 5px top no-repeat;
      background-size:21px 12px;
      padding-top:20px;
      img{
        .wh(30px,30px);
      }
    }
    .num{
      .bg-color(#f2f2f2);
      .c(#878787);
      .dib(60,26);
      .tc;
      .border-radius(13px);
    }
  }
}

.btn{
  .dba(80,40);
  .tc;
  border-bottom:3px solid #d16464;
  .border-radius(20px);
}
.yellow-btn{
  .fr;
  .w(120px);
  .bg-color(#ffd102);
  border-bottom-color:#b79d6c;
}
.more{
  .bg-size('index_icon.png',172px,auto);
}
.branch{
  .mt10;
  .cont{
    padding:10px;
    .h(100px);
  }
  .logo{
    .fl;
    .mr10;
    .wh(100px,100px);
  }
  p{
    .c(#969696);
    .lh(20);
    .pt(20);
    .h(60px);
    .ell-line(3);
  }
}
.activity{
  .p10;
  .bdb(#dcdcdc);
  .item{
    .mb(10);
    .label{
      .bd(#ea6969);
      .border-radius();
      .mr10;
      .c(#ea6969);
      padding:4px 10px;
      .lh(30);
    }
  }
}
.goods-introduction{
  .bar{
    .ptb();
    .bg-color(#f2f2f2);
    .bdb(#dcdcdc);
    h3{
      .pl(10);
      .ml(10);
      border-left:5px solid #ffd102;
    }
  }
  .cont{
    .p10;
    .c(#404040);
    .lh(24);
    .h(100px);
    .oh;
  }
  .cont.open{
    .h(auto);
  }
}
.arrow-down-icon{
  background-position:-72px 7px;
}
.comment-list{
  white-space: nowrap;
}
.comment-item{
  .bg-color(#ebebeb);
  .border-radius();
  padding:5px 10px;
  .w(220px);
  .pr;
  .ml(20);
  display:inline-block;
  .tx{
    .wh(30px,30px);
    .border-radius(100%);
    border:2px solid #fff;
    .pa(-15px,30px);
  }
  .pic{
    .fl;
    .wh(80px,80px);
    .mr10;
  }
  .desc{
    white-space: normal;
    .ell-line(4);
    .lh(20);
  }
}
.linear-bg{
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.9) 98%, #000 100%);
}
.article-list{
  .mb(10 );
  .tit{
    .lh(30);
    .pl(10);
  }
  .pic{
    .pr;
    .img{
      .wh(100%,160px);
    }
    .foot{
      .lh(32);
      .pab();
      .w(100%);
      .box-sizing();
      padding:40px 10px 10px;
      .linear-bg;
      .cw;
      span{
        .fr;
      }
    }
    .tx{
      img{
        .wh(30px,30px);
        .bd(#ffffff);
        .border-radius(100%);
      }

    }
  }
}
.play-icon{
  .ab-center(78,78);
}
.article{
  .cont{
    .p10;
  }
}
.goods-collection{
  .list{
    .ptb(10);
    .w(100%);
    overflow-x:auto;
    ul{
      white-space:nowrap;
      -webkit-overflow-scrolling:touch;
    }
    li{
      display:inline-block;
      .w(116px);
      .plr(5);
      .lh(26);
      .tc;
    }
    .pic{
      .wh(116px,116px);
    }
    .tit{
      .mt10;
      .fz(14);
      .c(#4a4a4a);
    }
    .desc{
      .c(#c5c5c5);
    }
    .price{
      .c(#4a4a4a);
    }
  }
}
.fix-footer{
  position:absolute;
  left:0;
  bottom:0;
  z-index:5;
  .dl(50);
  .w(100%);
  .bg-color(#2e2e2e);
  li{
    .fl;
  }

}
.im,.car{
  .lh(20);
  .w(20%);
  .tc;
  .fz(12);
  .icon{
    .db;
    margin:5px auto 0;
  }
  a{
    .c(#adadad);
  }

}
.car{
  .pr;
  .num{
    .bg-color(#ee4e4e);
    .cw;
    .pa(50%,3px);
    padding:0 5px;
    .dl(12);
    .border-radius(6px);
    .fz(10);
  }
}
.im-icon{
  background-position:-97px 2px;
}
.car-icon{
  background-position:-78px -30px;
}
.add-car{
  .w(35%);
  .fz(18);
  .tc;
  .bg-color(#414141);
  a{
    .cw;
  }
}
.buy-btn{
  .w(25%);
  .tc;
  .fz(18);
  .bg-color(#ffd102);
}
.where-buy{
  .w(60%);
  .bg-color(#414141);
  .tc;
  a{
    .cw;
  }
}
.arrow-right-icon{
  .dib(15,20);
  background-position:-78px -73px;
  vertical-align: middle;
  margin-top:-2px;
}
.h60{
  .h(60px);
}

.buy-page{
  .bg-color(rgba(0,0,0,.4));
  .wh(100%,100%);
  //.pab(0,0,6);
  .pf(0,0,6);
}
.buy-info{
  .pab();
  .w(100%);
  .bg-color(#fff);
  header{
    .p10;
  }
  .goods-pic{
    .fl;
    .wh(50px,50px);
  }
  .price{
    .mt10;
  }
  .tit{
    font-weight:normal;
    .fz(16);
    margin-right:30px;
  }
  .now-price{
    .fz(18);
    .c(#eb5858);
  }
  .original-price{
    .c(#9c9c9c);
    .mt10;
  }
  .close-icon{
    .par(10px,10px);
    background-position:-48px -57px;
    .bg-color(#fff);
  }
}
.buy-btn-1{
  .db;
  .dl(50);
  .tc;
  .c(#face01);
  .bg-color(#21222a);
  .fz(16);
  box-shadow:0 -2px 3px #21222a;
}
.choose{
  .p10;
  .lh(50);
  .item{

  }
  .keyword{
    .fl;
    .c(#444);
  }
  .type{
    .bd(#7b7b7b);
    .c(#7b7b7b);
    .db;
    .fl;
    padding:0 10px;
    .dl(30);
    margin:10px 0 5px 10px;
  }
  .type.on{
    .c(#eb5858);
    .bd(#eb5858);
  }
}
.num-item{
  .keyword{
    .fl;
  }
  .choose-num{
    .fl;
    .ml10;
    .bd(#dfdfdf);
    .dl(36);
    .mt(6);
  }
  a{
    .db;
    .fl;
    .wh(36px,36px);
  }
  .subs{
    border-right:1px solid #dfdfdf;
  }
  .add{
    border-left:1px solid #dfdfdf;
  }
  .icon-subs{
    margin:6px;
    background-position:3px -55px;
  }
  .icon-add{
    margin:6px;
    background-position:-25px -56px;
  }
  input{
    .wh(60px,36px);
    .fl;
    .c(#4d4d4d);
    .fz(18);
    .fb;
    .tc;
    padding:0;
    border:0;
  }
  .less{
    .ml(10);
    .c(#e4e4e4);
  }
}
body{
  .oh;
}
.wrap{
  .h(100%);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}